console.log('index.js:引入成功');

require("./components/header/header")

var root = vm = avalon.define({
  $id  : "app",
  name : "司徒正美",
  array: [11, 22, 33],
  contents:"hello!here is home",
  alert:'test',
  currPath:'',
  currPage:''
});

setTimeout(function () {
  vm.array.set(0, 444)
}, 3000);

console.log('测试全局Jquery是否正确引用',$('div'));



var states = {};


avalon.component('ms-view', {
    template: '<div ms-html="@page" class="ms-view"></div>',
    defaults: {
        page: '&nbsp;',
        path: 'no ',
        onReady: function(e) {
            var path = e.vmodel.path;
            var state = states[path];
            console.log(states,'ffffff')
            avalon.vmodels[state.vm.$id] = state.vm;
            avalon.vmodels[state.vm.$id].init();
            //  生命周期 onInit onReady onViewChange onDispose
            // template,自定义标签的outerHTML,它必须是用一个普通的HTML元素节点包起来,里面可以使用ms-*等指令, 里面的属性只能是defaults中定义的属性与方法
            // defaults,用来定义这个组件的VM有什么属性与方法
            // soleSlot,表示组件只有一个插槽,会将组件容器的所有孩子都移到这里来 ,可选。

            setTimeout(function() {//必须等它扫描完这个template,才能替换
                e.vmodel.page = state.html
            },100)
        },
        onDispose: function(e) {
            var path = e.vmodel.path;
            var state = states[path];
            var vm = state.vm;
            var render = vm.render;
            render && render.dispose();
            delete avalon.vmodels[vm.$id]
        }
    }
});

function getPage(path) {
    path = path.slice(1);
    var html = '<xmp is="ms-view" class="view-container" ms-widget="{path:\'' + path + '\',page: @page}"><xmp>';
    return html
}
function addState(path, vm, html) {
    path = path.slice(1);
    states[path] = {
        vm: vm,
        html: html
    }
}
var pages = require("./router");
pages.forEach(function(page) {
    var pathname = page.entery;
    var html = require('./pages/' + pathname + '.html');

    var vm = require('./pages/' + pathname + '.js');
    addState(page.url, vm, html);

    avalon.router.add(page.url, function(a) {

        var renderPage =  getPage(this.path);
        root.currPath = this.path;
        root.currPage = renderPage;
    })
});


avalon.history.start({
    root: "/"
});
avalon.router.navigate('/', 0);
// avalon.history.setHash('/bb/second');

avalon.ready(function() {
    avalon.scan(document.body)
});
